<template>
  <div class="cu-list">

    <div class="uni-flex uni-column padding-sm cu-item" v-for="[key, value] in arrSalesVolume" :key="key">
      <div>
        <text class="text-lg" style="color: #999999;padding-left: 5px">{{ key }}</text>
      </div>
      <div class="flex bg-white" @click="onClick(key)">
        <div class="uni-flex uni-column padding-sm flex-treble">
          <div class="text-price text-xxl text-bold margin-sm">
            <text style="color: #393939">{{ value }}</text>
          </div>
          <div class="text-lg margin-sm">
            <text v-if="businessIncome.incomeDetailByTransactionsNum[key]===0">当日无交易</text>
            <text v-else>
              收款{{ businessIncome.incomeDetailByTransactionsNum[key] }}笔，毛利额{{ businessIncome.incomeDetailByGross[key] }}元
            </text>
          </div>
        </div>
        <div class="flex-sub" style="text-align: center;color: #999999;padding-top: 10%;">
          <text v-if="businessIncome.incomeDetailByTransactionsNum[key]!==0" class="cuIcon-right lg text-gray" style="padding-left: 50%"></text>
        </div>
      </div>
    </div>

  </div>
  <div class="text-lg padding" style="text-align: center;color: #999999">
    <text>仅支持查看最近30天的记录</text>
    <br>
    <text>更多记录请使用电脑访问rsms.golxen.cn</text>
  </div>

</template>

<script>
import request from "../../utils/request";
import dateTimeUtils from "../../utils/dateTimeUtils";

export default {
  name: "index",

  data() {
    return {
      businessIncome: {},
      arrSalesVolume: []
    }
  },

  mounted() {
    uni.setNavigationBarTitle({
      title: '收款记录'
    });
    const now = new Date();
    let endDate = dateTimeUtils.dateTimePlusMinus(now, 1)
    let startDate = dateTimeUtils.dateTimePlusMinus(endDate, -30)
    endDate = dateTimeUtils.dateTimeFormat(endDate)
    startDate = dateTimeUtils.dateTimeFormat(startDate)
    request.post(
        "/business/get/businessIncomeByDays",
        {
          startDate: startDate,
          endDate: endDate,
          storeId: uni.getStorageSync("currentStoreMain").storeId
        }).then(res => {
      this.businessIncome = res.data
      const mapSalesVolume = new Map(Object.entries(this.businessIncome.incomeDetailBySalesVolume))
      let arrSalesVolume = Array.from(mapSalesVolume)
      arrSalesVolume.sort(function (a, b) {
        return b[0].localeCompare(a[0])
      })
      this.arrSalesVolume = arrSalesVolume
    })
  },

  methods:{
    onClick:function (date) {
      if(this.businessIncome.incomeDetailByTransactionsNum[date]!==0){
        const salesVolume=this.businessIncome.incomeDetailBySalesVolume[date]
        const transactionsNum=this.businessIncome.incomeDetailByTransactionsNum[date]
        const gross=this.businessIncome.incomeDetailByGross[date]
          uni.navigateTo({
              url:"/pages/collection/CollectionDetail?date="+date+"&salesVolume="+salesVolume+"&transactionsNum="+transactionsNum+"&gross="+gross
          })

      }
    }
  }
}
</script>

<style scoped>

</style>